<template>
  <view class="home-container">
    <el-container>
      <el-main>
        <el-row :gutter="20">
          <el-col :span="24">
            <div class="welcome">
              <h2>欢迎使用管理系统</h2>
            </div>
          </el-col>
        </el-row>
        
        <el-row :gutter="20">
          <el-col :span="12">
            <el-card class="stat-card">
              <div slot="header" class="clearfix">
                <span>客户统计</span>
              </div>
              <div class="stat-content">
                <el-statistic group-separator="," decimal-separator="." :value="128" title="客户数量"></el-statistic>
              </div>
            </el-card>
          </el-col>
          
          <el-col :span="12">
            <el-card class="stat-card">
              <div slot="header" class="clearfix">
                <span>房屋统计</span>
              </div>
              <div class="stat-content">
                <el-statistic group-separator="," decimal-separator="." :value="56" title="房屋数量"></el-statistic>
              </div>
            </el-card>
          </el-col>
        </el-row>
        
        <el-row :gutter="20" style="margin-top: 20px;">
          <el-col :span="24">
            <el-card>
              <div slot="header" class="clearfix">
                <span>最近活动</span>
              </div>
              <el-timeline>
                <el-timeline-item
                  v-for="(activity, index) in activities"
                  :key="index"
                  :timestamp="activity.timestamp">
                  {{ activity.content }}
                </el-timeline-item>
              </el-timeline>
            </el-card>
          </el-col>
        </el-row>
      </el-main>
    </el-container>
  </view>
</template>

<script>
export default {
  data() {
    return {
      activities: [
        {
          content: '新增客户 张三',
          timestamp: '2025-11-30'
        },
        {
          content: '新增房屋信息 北京市朝阳区某某小区',
          timestamp: '2025-11-29'
        },
        {
          content: '客户 李四 完成签约',
          timestamp: '2025-11-28'
        }
      ]
    }
  }
}
</script>

<style scoped>
.home-container {
  padding: 20rpx;
}

.welcome {
  text-align: center;
  margin-bottom: 30px;
}

.stat-card {
  margin-bottom: 20px;
}

.stat-content {
  text-align: center;
  padding: 20px 0;
}
</style>